<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>首页</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/layui.css">
  <link rel=”icon” href=”${pageContext.request.contextPath}/static/img/favicon.ico” mce_href=”/favicon.ico” type=”image/x-icon”>
  <link rel=”shortcut icon” href=”${pageContext.request.contextPath}/static/img/favicon.ico” mce_href=”/favicon.ico” type=”image/x-icon”>
  <!-- <link rel="stylesheet" href="css/narrow.css" type="text/css" /> -->
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/home.css" type="text/css"/>
  <%--<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->--%>
  <%--<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"--%>
  <%--integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">--%>
  <%--<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"--%>
  <%--integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">--%>
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/style.css" type="text/css"/>
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/style2.css" type="text/css"/>
  <%--<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/common.css">--%>
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/index.css">
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/banner.css">
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/tip-yellow.css">
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/banner.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/ymtx.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/util.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.artdialog.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.animatenumber.min.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/experience_tender.js"></script>
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/wytz.css">
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/lightbox.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/style4.css" type="text/css"/>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/home.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/ppcommon.js"></script>
  <%--<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->--%>
  <%--<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"--%>
  <%--integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"--%>
  <%--crossorigin="anonymous"></script>--%>
  <style type="text/css">
    /* 对全部标签对象进行初始化操作 */
    *::selection { /*即点击全部的任何标签插件时都不会有背景颜色，因为默认的标签对象当中当进行多次点击操作时会出现背景色*/
      background: none;
    }

    body, ul, li {
      margin: 0px;
      padding: 0px; /*设置内边距为0*/
      list-style: none; /*设置标签对象当中的其它默认属性为无*/
    }

    /*将页面标签和序列标签对象当中的内外边距都设置为0，默认情况下是有内外边距的.margin:边距*/
    /*全部标签对象初始化完毕*/

    /*对盒子的样式进行设置操作*/
    #box {
      width: 1000px;
      height: 385px;
      position: relative; /*对当前的div标签对象进行相对定位操作*/
      margin: 10px auto; /*设置box标签对象的上边距为100像素，左右为自动居中操作*/

      overflow: hidden; /*overflow是指当标签对象当中的内容超出边框的范围之时就会对超出容器部分的内容进行隐藏操作*/
    }

    /*盒子的样式设置完毕*/

    /*对图片所在的无序列表li标签对象进行样式设置操作*/
    .img-li { /*对无序列表标签对象当中样式进行设置操作*/
      width: 100%; /*对无序列表标签当中的数据的宽高都设置为100%即和box当中的长宽是相互吻合的*/
      height: 100%;
      position: absolute; /*对无序标签对象当中的元素进行绝对定位使得所有的图片都叠加到了一个固定的位置中去了*/
      /*将所有的图片都设置为透明的*/
      opacity: 0; /*opacity 属性设置元素的不透明级别,级别为0-1之间,此时li标签对象当中的图片都为透明的不会进行显示*/
      transition: 2s; /*用于设置每一张图片相互之间的渐变时间的切换，当前每两个页面之间的时间的切换过程为3秒*/
    }

    /*对图片所在的无序列表li标签对象当中的样式设置完毕*/

    /*对img-li标签对象的第一个子节点表标签对象开始进行样式设置*/
    .img-li:FIRST-CHILD { /*将无序列表项当中的第一个子节点对象当中的图片的内容设置为不透明的*/
      opacity: 1;
    }

    /*对img-li标签对象的第一个子节点表标签对象结束样式设置*/

    /*对图片当中的两个切换图片的按钮开始样式设置*/
    .img-button { /*对button类当中的样式格式内容进行设置操作*/
      width: 80px;
      height: 30px;
      /*设置button样式类当中的背景颜色*/
      position: absolute; /*设置button样式类型当中的位置为绝对定位操作*/
      top: 170px; /*设置当前的按钮到盒子顶部的像素为135*/
      text-align: center; /*设置button样式类当中的字体的位置为正中间*/
      line-height: 30px; /*设置行高，即距离当前样式框顶部的像素*/
      cursor: pointer; /*cursor(光标)*,即当光标移动到了设置了button样式的标签对象当中之后将会变为手形的光标*/
    }

    /*对图片当中的两个切换图片的按钮结束样式设置*/

    /*对图片右边的按钮进行样式的设置*/
    #next {
      right: 0px; /*设置next标签对象距离当前盒子的右边距离为0像素*/
    }

    /*-----------------当前样式设置完毕--------------------*/

    /*对小圆点按钮对象当中的ul标签对象进行样式的设置*/
    .button-ul { /*设置ul无序列表标签对象的高度和宽度,以及ul标签对象当中的背景颜色*/
      height: 22px;
      width: 80px;
      /*ul标签对象当中进行存放内容的区域依然为一个长方形采用border属性值可以将之修改为一个圆角矩形*/
      /*background: #000;*/
      /*对ul标签对象的背景颜色进行设置操作，前三个参数为rgb所对应的颜色参数最后一个0.5则是用于设置当前颜色的透明度*/
      padding: 5px 25px; /*对ul标签对象进行内边距的设置操作，将上下设置为5px，左右为25px*/
      border-radius: 15px; /*设置圆角的半径*/
      position: absolute; /*将ul标签对象设置为绝对定位的方式，为了让ul标签可以移动到盒子当中所显示的图片的指定的位置当中去*/
      top: 340px; /*设置ul标签对象相对于div标签对象的顶部的距离为240像素*/
      left: 230px; /*相会于盒子左边的距离为220像素*/
    }

    /*------------------当前样式设置完毕------------------------------*/

    /*对按钮无序列表对象当中的li子标签对象当中的样式进行设置操作*/
    .button-ul li { /*为li标签对象进行长宽和边界颜色进行设置，注意此时的四个li标签对象是竖直程线性进行排列的，要想使得当前的四个标签对象程现为水平状态进行排列操作则要将之设置为float浮动型的*/
      width: 10px;
      height: 10px;
      /*注此时在li标签当中进行内容添加的区域为一个10*10的正方形区域*/

      float: left;
      /*设置ul标签对象当中的字体颜色为白色*/
      list-style-type: none; /*用于去除li标签对象当中小实心圆点样式*/
      margin-right: 5px; /*设置li标签对象右方的外边距为3像素*/
      border-radius: 5px; /*进行边框半径的设置操作，将当前li标签对象当中进行内容输入的正方形区域设置为一个半径为5的圆形区域,即将li标签对象的内容输入区域的边框设置为圆脚区域*/
      cursor: pointer; /*cursor(光标)*,即当光标移动到了设置了button样式的标签对象当中之后将会变为手形的光标*/
    }

    /*对圆点按钮对象进行悬浮样式设置，即当鼠标移动到圆点按钮上时所触发的样式事件*/
    .button-li:HOVER { /*对img-button样式当中的悬浮样式进行设置操作，即当鼠标移动到设置了button样式表的标签当中时所会触发的样式*/
      background: #fff; /*当鼠标移动到设置了button样式的标签当中时，其背景颜色将会发生变化*/
    }

  </style>

</head>

<body>

<div class="page" >
  <!--header-->
  <div class="header">
    <div class="top">
      <div class="top_con">
        <ul class="top_left">
          <li><span class="icon-home-02"></span><a href="javascript:;">加入收藏</a></li>
          <li><span class="icon-home-05"></span><a href="javascript:;">关注我们</a></li>
          <li><span class="icon-home-03"></span><a href="javascript:;">在线客服</a></li>
        </ul>
        <ul class="top_right">
          <li>你好，欢迎来到喜币金融！</li>
          <li>
            <input type="button" value="登录" class="btn_login"/>
          </li>
          <li>
            <a href="${pageContext.request.contextPath}/view/regist"><input type="button" value="注册"
                                                                            class="btn_regist"/></a>
          </li>
        </ul>
      </div>
    </div>
    <div class="nav">
      <div class="nav_con">
        <ul class="nav_logo">
          <li></li>
          <li class="jianbing">喜币金融</li>
          <li></li>
        </ul>
        <ul class="nav_indro">
          <!-- <li class="l_one">安全网贷系统</li> -->
          <li class="l_two">XBFINANCE.COM</li>
          <li class="l_three">中国最大的P2P系统服务商</li>
        </ul>
        <ul class="nav_list">
          <li><a href="javascript:;">首页</a></li>
          <li><a href="myAccount.html">我的账户</a></li>
          <li><a href="javascript:;">财富资讯</a></li>
        </ul>
      </div>
    </div>
  </div>
  <!-- 登陆 -->
  <div class="landing">
    <div class="login-poptit">
      <a href=" " title="关闭" class="login-close"></a>
      <span class="landing-txt">登录</span>
    </div>
    <div class="login-popbody">
      <p class="p_con">为提升账户安全性，已取消昵称登陆</p >
      <form class="loginform" name="loginform" action="${pageContext.request.contextPath}/user/login" method="post">
        <div class="login-icon">
          <div class="login-icon-pic">
            <!-- < img src="${pageContext.request.contextPath}/static/img/ymh.png"/> -->
          </div>
          <input class="ipt" type="text" name="email" placeholder="输入邮箱" />
        </div>
        <div class="login-icon">
          <div class="login-icon-pic login-icon-pic1">
            <%--< img src="${pageContext.request.contextPath}/static/img/mm.png"/>--%>
          </div>
          <input class="ipt" type="password" name="loginpass" placeholder="输入登陆密码" />
        </div>
        <div class="login-forget">
          <a href="">忘记密码？</a>
        </div>
        <div class="login-botton">
          <input type="submit" value="立即登录" class="btn">
        </div>
        <p class="login-footer">
          <a href="">没有账号去注册</a>
        <p>
      </form>
    </div>
  </div>

  <div class="tzxq_t" style="margin: auto">
    <div class="tzxq_t_title" style="margin: auto">
      <%--<img src="${pageContext.request.contextPath}/picture/icoty.png" width="25" height="32">--%>
      <span>${list.proname}</span>
      <font>借贷编号：${list.proid}</font>
      <div class="clear"></div>
    </div>
    <div class="tzxq_t_t" style="margin: auto">
      <div class="tzxq_t_tl" style="margin: auto">
        <div class="tzxq_t_tlt" style="margin: auto">
          <ul>
            <li><span>${list.proapr} </span><font>年化利率</font></li>
            <li><span>${list.protimelimit}月</span><font>项目期限</font></li>
            <div class="clear"></div>
          </ul>
        </div>
        <div class="tzxqxx" style="margin: auto">
          <dl>
            <dd>募集总额：<font>￥${list.proaccount}元</font></dd>
            <dd>审核时间：<font>${list.proverifytime}</font></dd> </dl>
        </div>
      </div>
      <div class="tzxq_t_tr">
        <div class="tzxq_t_tr_w">
          <div class="tzxq_t_tr_n1">
                            	<span class="w140 g2 f18" >
		          募集中</span>
            <span class="w200 g9"><strong>${list.proaccountyes/list.proaccount}</strong></span>
            <div class="clear"></div>
          </div>
          <div class="jd2w">
            <div class="jd2n" style="width:${list.proaccountyes/list.proaccount};"></div>
          </div>
          <div>
            <ul class="tzxq_t_tr_n1">
              <li>
                <span class="w140 g9 f16" >可投金额</span>
                <span class="w200 g9 f16"><strong class="g3">${list.proaccount-list.proaccountyes}</strong>元</span>
                <div class="clear"></div>
              </li>
            </ul>
            <form action="${pageContext.request.contextPath}/addOrder">
              <input type="hidden" name="projectid" value="${list.proid}">
            <div class="tzxq_t_tr_n2">
              <div class="tzxq_t_tr_n2l">金额：</div>
              <input class="tzxq_t_tr_n2r" type="text"value="请输入投资金额" name="money" id="account" maxlength="9" onkeyup="checkAccount()" onFocus="OnEnter(this)" onBlur="OnExit(this)" />
              <div class="tzxq_t_tr_n2l">支付密码：</div>
              <input class="tzxq_t_tr_n2r" type="text"value="请输入支付密码"  name="paypass" maxlength="9" onkeyup="checkAccount()" onFocus="OnEnter(this)" onBlur="OnExit(this)" />
            </div>
            <div class="tzxq_t_tr_n3" id="account_tip">每投资<span class="g2">10000元体验金</span>收益<span class="g7">8.33元</span></div>
            <div class="tzxq_t_tr_n4">
              <input type="submit" id='account_but' value="立即投资" />
            </div>
            </form>
          </div>
          <div class="tzxq_t_tr_n3"></div>
        </div>
      </div>
      <div class="clear"></div>
    </div>
  </div>

  <!--官方公告-->
  <div class="project_list">
    <div class="project_list_con">
      <%--<div class="pl_img"><img src="${pageContext.request.contextPath}/static/img/ghj_12.png"/></div>--%>
      <div class="pl_list">
        <div class="pl_title">
          <ul class="pl_line">
            <li class="pl_prolist5">官方公告</li>
            <li class="pl_more5"><a href="javascript:;">更多&gt;</a></li>
            <div class="topdirection5"></div>
          </ul>
          <p class="plist_line5"></p>
        </div>
        <div class="pl_table">
          <table class="website_table">
            <tr>
              <td style="width: 33%;"><img src="${pageContext.request.contextPath}/static/img/we_22.png"
                                           style="width: 100%;"/></td>
              <td style="width: 33%;"><img src="${pageContext.request.contextPath}/static/img/we_24.png"
                                           style="width: 100%;"/></td>
              <td style="width: 33%;"><img src="${pageContext.request.contextPath}/static/img/we_26.png"
                                           style="width: 100%;"/></td>
            </tr>
          </table>
        </div>
      </div>
    </div>
  </div>
  <!--footer-->
  <div class="footer">
    <div class="footer_con">
      <div class="footer_nav">
        <ul class="footer_list">
          <li><a href="javascript:;">关于我们</a></li>
          <li><a href="javascript:;">新手入门</a></li>
          <li><a href="javascript:;">我要借款</a></li>
          <li><a href="javascript:;">我要理财</a></li>
          <li><a href="javascript:;">帮助中心</a></li>
          <li><a href="javascript:;">利息计算器</a></li>
        </ul>
        <ul class="footer_we">
          <li>关注我们：</li>
          <li class="f_yuan"><span class="icon-home-05"></span></li>
          <li>关注微博</li>
          <li class="f_yuan"><span class="icon-home-04"></span></li>
          <li>关注微信</li>
        </ul>
        <ul class="footer_link">
          <li>友情链接：网贷平台 保险机构 财富动力 网证券之星 今日汇率网 中金外汇网 络投资 股权众筹 保信贵金属 互联网金融 大连金融网 银行贷款利率 信托产品房产 贷款保险网 沈阳p2p
            理财博凯
          </li>
        </ul>
      </div>
      <div class="footer_right">
        <ul class="footer_call">
          <li><span class="icon-home-09 foot_icon"></span> <span class="foot_call">4009-150-151</span> <span
                  class="foot_time">客服工作时间：9:00-21:00</span></li>
        </ul>
        <ul class="foot_link_pic">
          <li><img src="${pageContext.request.contextPath}/static/img/abcd_08_06.png"/></li>
          <li><img src="${pageContext.request.contextPath}/static/img/abcd_08_08.png"/></li>
          <li><img src="${pageContext.request.contextPath}/static/img/abcd_08_10.png"/></li>
          <li><img src="${pageContext.request.contextPath}/static/img/abcd_08_03.png"/></li>
        </ul>
      </div>
    </div>
  </div>
  <p class="footer_bottom">&copy;2015I车保网贷金融服务有限公司 京ICP证140334号</p>
</div>


</body>

</html>